import React, { Component } from 'react';
import "../styles/View_orders.scss";
import { NavBar, Tabs, } from 'antd-mobile';
import * as service from "../api/index";

class View_orders extends Component {
    constructor(props) {
        super(props);
        this.state = {
            shoplist: [],
        };
    }

    async componentDidMount() {
        var res = await service.user_orderlist({ userid: localStorage.getItem('userid'), })

        // console.log(res.data.data);
        this.setState({ shoplist: res.data.data, })

        // console.log(this.props.location.state);

    }

    render() {
        return (
            <div className='view_orders'>
                <div className="top">
                    <div className="nav"><NavBar onBack={() => { this.props.history.go(-1) }} ><p>订单查看</p></NavBar></div>

                </div>
                <div className="address">
                    <Tabs >
                        <Tabs.Tab title='全部订单' key='all'>
                            <div className="shop">
                                {
                                    this.state.shoplist.map((item, index) => {
                                        return (
                                            <div className="one" key={index}>
                                                <div className="left">
                                                    <img src={item.img1} alt="" />
                                                </div>
                                                <div className="right">
                                                    <h5>{item.proname}</h5>
                                                    <div className="xia">
                                                        <div className="zuo">
                                                            <span>￥{item.originprice}</span>
                                                        </div>
                                                        <div className="you">
                                                            <span>去支付</span>
                                                        </div>
                                                    </div>
                                                </div>
                                            </div>
                                        )
                                    })

                                }
                            </div>
                        </Tabs.Tab>
                        <Tabs.Tab title='待付款' key='no-money'>
                            待付款
                        </Tabs.Tab>
                        <Tabs.Tab title='待收货' key='no-shouhuo'>
                            待收货
                        </Tabs.Tab>
                        <Tabs.Tab title='待评价' key='no-pingjia'>
                            待评价
                        </Tabs.Tab>
                    </Tabs>
                </div>
            </div >
        );
    }
}

export default View_orders;


